<!DOCTYPE html>
<html>
<head>
	<title>Contact us by email</title>
	<meta charset="utf-8">
	<link rel="stylesheet" type="text/css" href="static/layui/css/layui.css">
	<style type="text/css">
		.field-item::after{content:'';height: 0;clear: both;visibility: none;display: block;zoom: 1;}
		.field-item{margin: 10px 0;}
		.field-item > div{line-height: 38px;}
		.layui-form{max-width: 900px;margin: 0 auto;}
		.diabled{background-color: #ddd;}
		.wrap{padding-top: 50px;}
		.layui-form-label{width: auto;}
	</style>
</head>
<body>
	<div>
		<div class="wrap">
			<form class="layui-form">
				<p style="font-size: 24px;">Get in touch with us now!</p>
				<div style="margin: 10px 0;padding: 5px;overflow: auto;">
					Feel free  to contact us to get more information by filling out the form below width your contact information.
				</div>
				<div class="layui-form-item">
				    <label class="layui-form-label">Name</label>
				    <div class="layui-input-block">
				      <input type="text" name="name" placeholder="" autocomplete="off" class="layui-input">
				    </div>
  				</div>
  				<div class="layui-form-item">
				    <label class="layui-form-label">Email</label>
				    <div class="layui-input-block">
				      <input type="text" name="email"  placeholder="" autocomplete="off" class="layui-input">
				    </div>
  				</div>
  				<div class="layui-form-item">
				    <label class="layui-form-label">Mobile</label>
				    <div class="layui-input-block">
				      <input type="text" name="email"  placeholder="" autocomplete="off" class="layui-input">
				    </div>
  				</div>
				<div class="layui-form-item layui-form-text">
				    <label class="layui-form-label">Message</label>
				    <div class="layui-input-block">
				      <textarea name="message"  placeholder="" class="layui-textarea"></textarea>
				    </div>
				</div>
				
				<div class="layui-form-item tc button-wrap" style="margin-top: 30px;text-align: center;">
					<button style="display: inline-block;float: none;" class="layui-btn" lay-submit lay-filter="formDemo">Sent Now</button>
				    <!-- <button class="layui-btn" lay-submit lay-filter="formDemo">立即提交</button>
				    <button type="reset" class="layui-btn layui-btn-primary">重置</button> -->
				</div>
			</form>
		</div>
	</div>
	<script type="text/javascript" src="https://d3s6yopk5rlhed.cloudfront.net/static/js/jquery.min.js"></script>
	<script type="text/javascript" src="https://d3s6yopk5rlhed.cloudfront.net/static/layui/layui.js"></script>
	<script type="text/javascript">
		$(function() {
			
		});
		layui.use('form', function(){
		  	var form = layui.form;
		  	form.on('submit(formDemo)', function(data){
		  		var name = $('input[name=name]').val();
		  		var email = $('input[name=email]').val();
		  		var mobile = $('input[name=mobile]').val();
		  		var messege = $('input[name=message]').val();
		  		if(!/.@./.test(email)){
		  			layer.msg('Email is required!');
		  			return false;
		  		}
		  		if(!/1[0-9]{10}/.test(mobile)){
		  			layer.msg('Mobile is required!');
		  			return false;
		  		}
		  		if(!message){
		  			layer.msg('Message is required!');	
		  			return false;
		  		}
		  	    layer.msg(JSON.stringify(data.field));
		  	    return false;
		  	  });
		});


		function submit() {
			
		}
	</script>
</body>
</html>